<!DOCTYPE html>
<html>
{include file="public/header" /}
<body>


<!--<div class="layui-card layadmin-header">-->
    <!--<div class="layui-breadcrumb" lay-filter="breadcrumb" style="visibility: visible;line-height: 50px;height: 50px;padding-left: 15px">-->
        <!--<a lay-href="">主页</a><span lay-separator="">/</span>-->
        <!--<a><cite>管理员</cite></a>-->
    <!--</div>-->
<!--</div>-->

<div class="layui-fluid" id="app" >
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card" >
                <!--<div class="layui-card-header">按钮主题</div>-->
                <div class="layui-card-body">



                    <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                        <ul class="layui-tab-title">
                            <li class="layui-this">管理员</li>
                            <li onclick="go('add')">新增管理员</li>

                        </ul>
                        <div class="layui-tab-content" style="padding-left: 0px;padding-right: 0px">

                            <div class="layui-tab-item layui-show">


                                <div class="layadmin-trailer">



                                    <table class="layui-table" lay-skin="line" >

                                        <thead>
                                        <tr>
                                            <th>账号</th>
                                            <th>联系方式</th>
                                            <!--<th>创建时间</th>-->
                                            <th>登录IP</th>
                                            <th>登录时间</th>
                                            <th>状态</th>
                                            <th>相关操作</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr v-for="(item,index) in items" :data_id="item.id">
                                            <td>{{item.username}}</td>
                                            <td>{{item.phone}}</td>
                                            <td>{{item.last_ip}}</td>
                                            <td>{{item.last_time}}</td>
                                            <td>
                                                <span v-if="item.status==1" class="layui-badge layui-bg-gray">{{item.status2}}</span>
                                                <span v-if="item.status==0" class="layui-badge layui-bg-red">{{item.status2}}</span>
                                            </td>
                                            <td>

                                                <div class="layui-btn-group">
                                                    <button class="layui-btn layui-btn-sm layui-btn-primary"
                                                            :data_id="item.id" :data_index="index" onclick="edit(this)">编辑
                                                    </button>
                                                    <button class="layui-btn layui-btn-sm layui-btn-primary"
                                                            :data_id="item.id" :data_index="index" onclick="del(this)">删除
                                                    </button>
                                                </div>

                                            </td>
                                        </tr>

                                        </tbody>
                                    </table>


                                </div>

                            </div>


                        </div>
                    </div>




                </div>
            </div>

        </div>


    </div>
</div>


<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>

    var app = new Vue({
        el: '#app',
        data: {
            items: []
        }
    });

    $(function () {
        init();
    });

    function init() {
        $.get( '/admin/admin/index','',
            function (res) {
                app.items = res.data;
            }
        );
    }

    layui.use(['table'], function () {
        var table = layui.table;
    });


    layui.$('#add').on('click', function () {

        layer.open({

            type: 2,
            title: '新增',
            shadeClose: true,
            shade: 0.01,
            area: ['80%', '80%'],
            content: "{:url('add')}" //iframe的url

        })

    });

    function edit(that) {

        var data_id = $(that).attr('data_id');
        layer.open({

            type: 2,
            title: '编辑',
            shadeClose: true,
            shade: 0.01,
            area: ['80%', '80%'],
            content: "{:url('edit')}?id="+data_id //iframe的url

        });


    }


    function del(that) {
        var data_id = $(that).attr('data_id');
        var data_index = $(that).attr('data_index');

        var index = layer.confirm('确认继续执行？', {
            btn: ['确定', '取消'] //按钮
        }, function () {
            $.post('{:url("del")}',{id:data_id},function (res) {
                if (res.code == 1) {
                    layer.msg(res.msg, {icon: 1})
                    app.items.splice(data_index, 1);
                }
                layer.close(index);
            });
        }, function () {
            layer.close(index);
        });
    }
</script>


</body>
</html>




